/// 使用translate实现水平垂直居中
/// @param {String} $direction [both] - 水平垂直,其它值`horizontal`和`vertical`
/// @param {Boolean} $fill 是否进行填充
@mixin translate-center($direction: both, $fill: false) {
  position: absolute;
  @if $direction == horizontal {
    left: 50%;
    transform: translate3d(-50%, 0, 0);
    @if $fill {
      width: 100%;
    }
  } @else if $direction == vertical {
    top: 50%;
    transform: translate3d(0, -50%, 0);
    @if $fill {
      height: 100%;
    }
  } @else {
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    @if $fill {
      width: 100%;
      height: 100%;
    }
  }
}
